<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>获取删除增加节点</title>
	</head>
	<body>
		<ul id="myUL">
			<li>春</li>
			<li id="summer">夏</li>
			<li>秋</li>
			<li>冬</li>
		</ul>
		<script>
			/*
			 * 获取当前节点的ul
			 * 查看当前节点的第一个子节点
			 * 查看当前节点的最后最后一个字节点
			 * 查看当前节点的名称
			 * 查看当前节点的所有子节点
			 */
			var ul=document.getElementById('myUL');
			var summer=document.getElementById('summer');
			//有9个子节点：文本节点，li节点
			//其中文本点： 就是标签前后的空白 换行符
			console.log("ul的所有子节点"+ul.childNodes);
			
			console.log("ul的第一个子节点"+ul.firstChild);
			console.log("ul的最后一个子节点"+ul.lastChild);
			
			/*
			 * 创建节点 增加 删除
			 * 创建节点 标签名称
			 */
			var h1=document.createElement('h1');
			h1.innerHTM="一年四季";
			//把h1节点增加到页面
			ul.appendChild(h1);
			
			//删除节点：
			//获取ul的最后一个子节点，然后删除
			ul.lastElementChild.remove();
			
			
		</script>
	</body>
</html>
